<!DOCTYPE html>
<html lang="zh">
	<head>
		<meta charset="UTF-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<title>Document</title>
		<style>
			#d1 {
				color: red;
			}

			#d2>div>div {
				background-color: orange;
			}
		</style>
	</head>
	<body>
		<mydiv id="d1">这里是自定义标签</mydiv>
		<div id="d2">
			<div>
				<div class="d2"></div>
				<!-- 使用h5新的语义化标签 区分传统div -->
				<section>这里是section的内容</section>
			</div>
			<div>
				<div class="d2"></div>
			</div>
		</div>
		<!-- h5新增的标签 -->
		<article>
			这里是文章主题
			<aside>页面之外的内容</aside>
			<bdi>可从新定义文本方向</bdi>
			<details>
				<summary>元素标题1</summary>
				<summary>元素标题2</summary>
				<summary>元素标题3</summary>
			</details>
			<dialog>定义对话框或窗体</dialog>
			<figcaption>
				<figure>
					图示、图片、图标
				</figure>
			</figcaption>
			<footer>页脚</footer>
			<header>页眉</header>
			<main>文章重点内容</main>
			<mark>这里是标记文字</mark>
			<meter value="1">度量</meter>
			<nav>导航</nav>
			<progress value="6" min="0" max="10">进度条</progress>
			<section>文章中的章节</section>
			<time>2023-3-29</time>
			<address>河南郑州市</address>
		</article>
		<!-- h5新增的表单输入内容 和H5的新属性-->
		<form action="" method="post" enctype="multipart/form-data">
			<input type="number" name="" id="" min="-100" max="100" step="3">
			<input type="password" name="" id="" autocomplete="new-password">
			<input type="text" value="" autofocus required>
			<input type="text" value="" placeholder="请输入账号6-8为数字或英文" pattern="[0-9a-zA-Z]{6,8}">
			<input type="tel" value=13712341234>
			<input type="submit" id="" name="提交" />
			<input type="reset" value="重置" disabled>
		</form>
	</body>
</html>
